<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>欢迎页面-X-admin2.0</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
    <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
    <link rel="stylesheet" href="/static/css/font.css">
    <link rel="stylesheet" href="/static/css/xadmin.css">
    <script type="text/javascript" src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
    <script type="text/javascript" src="/static/lib/layui/layui.js" charset="utf-8"></script>
    <script type="text/javascript" src="/static/js/xadmin.js"></script>
  </head>
  
  <body class="layui-anim layui-anim-up">
    <div class="x-nav">
      <span class="layui-breadcrumb">
        <a href="">首页</a>
        <a href="">订单管理</a>
        <a href="">
          <cite>订单列表</cite>
        </a>
        <!--<a>
          <cite>导航元素</cite></a>-->
      </span>
      <a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right" href="javascript:location.replace(location.href);" title="刷新">
        <i class="layui-icon" style="line-height:30px">&#xe666;</i></a>
    </div>
    <div class="x-body">
      <div class="layui-row" style="text-align: center">
        <form class="layui-form layui-col-md12 x-so">
          <input type="text" name="order_no"  placeholder="请输入订单号"  lay-verify="required" autocomplete="off" class="layui-input">
          <button class="layui-btn"  lay-submit="" lay-filter="sreach"><i class="layui-icon">&#xe615;</i></button>
        </form>
      </div>
      <table id="table11" lay-filter="test"></table>
      <script type="text/html" id="barDemo">
        {{#  if(d.pay_type == 2 && d.pay_status == 2 && d.order_status == 0){ }}
        <a class="layui-btn layui-bg-blue layui-btn-xs" lay-event="confirm">核销</a>
        {{#  } }}
        {{#  if(d.pay_status == 1 && d.pay_type == 1){ }}
        <a class="layui-btn layui-bg-blue layui-btn-xs" lay-event="pay">支付</a>
        {{#  } }}
        <a class="layui-btn layui-bg-blue layui-btn-xs" lay-event="food">菜品</a>
      </script>
    </div>
    <script>
      layui.use(['form','table'], function(){
	        var form = layui.form;
	        var table=layui.table;
          var tableIns =table.render({
                  elem: '#table11'
                ,align:'center'
                ,url: '{:url("order/orderData")}' //数据接口
                ,page: true //开启分页
                ,defaultToolbar: ['filter', 'print', 'exports']
                ,cols: [[ //表头
                  {field: 'id',fixed: 'left', title: 'ID', width:50}
                  ,{field:'shop_id',title:'店铺名称', width:200}
                  ,{field:'user_id',title:'用户昵称', width:100}
                  ,{field:'table_id',title:'桌号', width:60}
                  ,{field: 'order_no', title: '订单号', width:156}
                  ,{field: 'order_time', title: '下单时间', width:160}
                  ,{field: 'pay_time', title: '支付时间', width:160}
                  ,{field: 'money', title: '应付金额', width:86}
                  ,{field: 'discount', title: '折扣', width:80}
                  ,{field: 'cost', title: '订单金额', width:86}
                  ,{field: 'order_number', title: '人数', width:60}
                  ,{field: 'pay_type', title: '支付方式', width:110,templet: function(d){
                        if (d.pay_type == 1){
                            return '<span class=\'layui-btn layui-btn-xs layui-btn-normal\'>线下支付</span>';
                        }else {
                            return '<span class=\'layui-btn layui-btn-xs layui-bg-cyan\'>微信支付</span>';
                        }
                      }}
                  ,{field: 'pay_status', title: '支付状态', width:110,templet: function(d){
                          if (d.pay_status == 1){
                              return '<span class=\'layui-btn layui-btn-xs layui-bg-orange\'>未支付</span>';
                          }else {
                              return '<span class=\'layui-btn layui-btn-xs\'>已支付</span>';
                          }
                      }}
                  ,{field: 'order_status', title: '订单状态', width:110,templet: function(d){
                          if (d.order_status == 1){
                              return '<span class=\'layui-btn layui-btn-xs \'>已核销</span>';
                          }else if(d.order_status == 2) {
                              return '<span class=\'layui-btn layui-btn-xs \'>已评价</span>';
                          }else {
                              return '<span class=\'layui-btn layui-btn-xs layui-bg-red\'>未核销</span>';
                          }
                      }}
                  ,{field: 'content', title: '用户备注', width:100}
                  ,{field: 'remark', title: '订单备注', width:100,edit: 'text'}
                  ,{fixed: 'right', title:'操作', toolbar: '#barDemo', width:130}
                ]]
            });
          //单元格编辑
          table.on('edit(test)', function(obj){
              var info = {
                  id:obj.data.id,
                  field:obj.field,
                  value:obj.value,
              };
              $.post('{:url("order/remark")}',info,function (res) {
                  layer.msg(res.msg,{icon:1,time:1000});
              });
          });
          //监听事件
          table.on('tool(test)', function(obj){
              var data = obj.data;
              if(obj.event === 'food'){
                  x_admin_show('订单菜品','{:url("order/foodList")}?order_no='+data.order_no,'',500);
              }else if (obj.event === 'pay'){
                  x_admin_show('支付','{:url("order/offPay")}?order_no='+data.order_no,600,500);
              }else if (obj.event === 'confirm'){
                  layer.prompt({
                      title:'请输入桌号'
                  },function(value, index, elem){
                      $.post('{:url("order/confirm")}',{order_no:data.order_no,table_no:value},function (res) {
                          if (res.code == 1){
                              layer.msg(res.msg,{icon:1,time:1000},function (res) {
                                  window.location.reload();
                              });
                          } else {
                              layer.msg(res.msg,{icon:2,time:1000});
                          }
                      });
                  });
              }
          });
          form.on('submit(sreach)',function (data) {
              tableIns.reload({
                  where: data.field
                  ,page: {
                      curr: 1 //重新从第 1 页开始
                  }
              });
              return false;
          });
      });
    </script>
  </body>

</html>